﻿<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <link rel="Shortcut Icon" href="../../../Content/aecc.ico" type="image/x-icon" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="../../../Content/element-plus/index.css">
  <link rel="stylesheet" href="../../../Content/nprogress/nprogress.min.css">
  <link rel="stylesheet" href="../../../styles/vue-page-common.css">
  <script src="../../../Scripts/hooks/containercheck/close.js"></script>
  <script src="../../../Scripts/Array.prototype.flat.js"></script>
  <script src="../../../Scripts/ResizeObserver.js"></script>
  <script src="../../../Content/vue3/vue.global.js"></script>
  <script src="../../../Content/element-plus/index.full.min.js"></script>
  <script src="../../../Content/element-plus/icons-vue.js"></script>
  <script src="../../../Content/element-plus/zh-cn.min.js"></script>
  <script src="../../../Scripts/axios.min.js"></script>
  <script src="../../../Content/nprogress/nprogress.min.js"></script>
  <script src="../../../Scripts/dayjs.min.js"></script>
  <script src="../../../Scripts/axios.config.js"></script>
  <script src="../../../Scripts/crypto-js.min.js"></script>
  <script src="../../../Scripts/secret.js"></script>
  <title>件号数据查看</title>
  <style scoped>
    ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    /* 滚动条里面的小方块 */
    ::-webkit-scrollbar-thumb {
      background-color: #bdc0c7;
      border-radius: 4px;
    }

    ::-webkit-scrollbar-thumb:hover {
      background-color: #76787d;
    }

    .el-form-item {
      margin-bottom: 5px;
    }

    .item {
      display: inline-block;
      text-align: center;
      margin-right: 5px;
    }

    .item-image-container {
      width: 100px;
      height: 40px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .item-text {
      font-weight: bold;
      font-size: 14px;
      color: #1E9FFF;
      margin-bottom: 6px;
    }

    .handle-container {
      border-radius: 4px;
      border: 1px solid #EBEEF5;
      background-image: linear-gradient(to right, #C4E6FF 0%, #fff 100%);
      margin-top: 10px;
      padding: 10px;
      box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
    }

    .item-icon {
      font-size: 35px;
      color: #1E9FFF;
      transition: all 1.5s;
      font-size: 30px;
    }
  </style>
</head>

<body>
  <div id="app" v-cloak>
    <el-form :inline="true" :model="queryInfo" :label-position="'top'" style="margin:5px;">
      <el-form-item label="零件号">
        <el-input v-model="queryInfo.productname" v-if="queryInfo.isshowproduct">
          <template #append>
            <el-button :icon="'Search'" @click="getProductList"></el-button>
          </template>
        </el-input>
        <el-select v-model="queryInfo.productid" style="width:239px" clearable @clear="productHandleClear"
          @change="productSelectHandle" v-else>
          <el-option v-for="item in queryInfo.productList" :key="item.PRODUCTID" :label="item.PRODUCTNAME"
            :value="item.PRODUCTNAME" />
        </el-select>
      </el-form-item>

      <el-form-item label="工艺路线">
        <el-input v-model="queryInfo.workflowname" v-if="queryInfo.isshowworkflow">
          <template #append>
            <el-button :icon="'Search'" @click="getWorkflowList"></el-button>
          </template>
        </el-input>
        <el-select v-model="queryInfo.workflowid" style="width:239px" clearable @clear="workflowHandleClear"
          @change="getProductAndWorkflowData" v-else>
          <el-option v-for="item in queryInfo.workflowList" :key="item.WORKFLOWID" :label="item.WORKFLOWNAME"
            :value="item.WORKFLOWID">
            <span style="color:red" v-if="item.ISUSE=='1'">{{ item.WORKFLOWNAME }}</span>
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="&nbsp;">
        <el-button type="primary" :icon="'Search'" @click="getProductAndWorkflowData">查询</el-button>
        <el-button type="primary" :icon="'Refresh'" @click="handleCanSearch">重置</el-button>
        <el-button type="warning" :icon="'Edit'" @click="handleOpenUse" v-if="mainDataInfoObj.workflowInfo.ISUSE=='1'">
          启用</el-button>
      </el-form-item>
    </el-form>

    <el-tabs v-model="mainDataInfoObj.label" style="margin:5px;">
      <el-tab-pane label="件号信息" name="product">
        <el-form :inline="true" :model="mainDataInfoObj.productInfo" :label-position="'top'">
          <el-form-item label="件号类型">
            <el-input v-model="mainDataInfoObj.productInfo.PRODUCTTYPENAME" disabled></el-input>
          </el-form-item>

          <el-form-item label="零件名称">
            <el-input v-model="mainDataInfoObj.productInfo.DESCRIPTION" disabled></el-input>
          </el-form-item>

          <el-form-item label="零件类型">
            <el-input v-model="mainDataInfoObj.productInfo.MATERIALTYPENAME" disabled></el-input>
          </el-form-item>

          <el-form-item label="特性类型">
            <el-input v-model="mainDataInfoObj.productInfo.CHARACTERTYPE" disabled></el-input>
          </el-form-item>

          <el-form-item label="物料编码">
            <el-input v-model="mainDataInfoObj.productInfo.MATERIALCODE" disabled></el-input>
          </el-form-item>

          <el-form-item label="管件毛坯">
            <el-input v-model="mainDataInfoObj.productInfo.MATERIALREQUEST" disabled></el-input>
          </el-form-item>

          <el-form-item label="材料牌号">
            <el-input v-model="mainDataInfoObj.productInfo.MATERIALTRADEMARK" disabled></el-input>
          </el-form-item>

          <el-form-item label="材料规格">
            <el-input v-model="mainDataInfoObj.productInfo.MATERIALSPECIFICATION" disabled></el-input>
          </el-form-item>

          <el-form-item label="毛料规格">
            <el-input v-model="mainDataInfoObj.productInfo.MATERIALSIZE" disabled></el-input>
          </el-form-item>

          <el-form-item label="是否锻铸件">
            <el-input v-model="mainDataInfoObj.productInfo.ISDUANZHU" disabled></el-input>
          </el-form-item>

          <el-form-item label="技术条件">
            <el-input v-model="mainDataInfoObj.productInfo.TECHNICALCONDITIONS" disabled></el-input>
          </el-form-item>

          <el-form-item label="首次使用件号">
            <el-input v-model="mainDataInfoObj.productInfo.FIRSTUSEDPRODUCT" disabled></el-input>
          </el-form-item>

          <el-form-item label="上次变更日期">
            <el-input v-model="mainDataInfoObj.productInfo.LASTCHANGEDATE" disabled></el-input>
          </el-form-item>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="工艺信息" name="workflow">
        <el-form :inline="true" :model="mainDataInfoObj.workflowInfo" :label-position="'top'">
          <el-form-item label="配套表">
            <el-input v-model="mainDataInfoObj.workflowInfo.BOMNAME" disabled></el-input>
          </el-form-item>

          <el-form-item label="大小件目录">
            <el-input v-model="mainDataInfoObj.workflowInfo.COLLECTPRODUCT" disabled></el-input>
          </el-form-item>

          <el-form-item label="发动机物料号">
            <el-input v-model="mainDataInfoObj.workflowInfo.LY2MODLE_NODE" disabled></el-input>
          </el-form-item>

          <el-form-item label="阶段">
            <el-input v-model="mainDataInfoObj.workflowInfo.PHASENODE" disabled></el-input>
          </el-form-item>

          <el-form-item label="机型">
            <el-input v-model="mainDataInfoObj.workflowInfo.PRODUCTFAMILYNAME" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺类型">
            <el-input v-model="mainDataInfoObj.workflowInfo.WORKFLOWTYPE" disabled></el-input>
          </el-form-item>

          <el-form-item label="设计图版次">
            <el-input v-model="mainDataInfoObj.workflowInfo.PART_REVID" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺规程版次">
            <el-input v-model="mainDataInfoObj.workflowInfo.LY2SEQUENCE" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺规程编号">
            <el-input v-model="mainDataInfoObj.workflowInfo.PROCESS_NO" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺员">
            <el-input v-model="mainDataInfoObj.workflowInfo.FULLNAME" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺所属分厂">
            <el-input v-model="mainDataInfoObj.workflowInfo.FACTORYNAME" disabled></el-input>
          </el-form-item>

          <el-form-item label="消耗定额">
            <el-input v-model="mainDataInfoObj.workflowInfo.USEQUOTA" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺关联的件号">
            <el-input v-model="mainDataInfoObj.workflowInfo.DEFAULTPRODUCT" disabled></el-input>
          </el-form-item>

          <el-form-item label="工艺类型2">
            <el-input v-model="mainDataInfoObj.workflowInfo.WORKFLOWTYPE2" disabled></el-input>
          </el-form-item>

          <el-form-item label="上次变更日期">
            <el-input v-model="mainDataInfoObj.workflowInfo.LASTCHANGEDATE" disabled></el-input>
          </el-form-item>
        </el-form>
      </el-tab-pane>
    </el-tabs>

    <el-table height="300" :data="mainDataInfoObj.workflowstepTable" :row-style="cellStyle" stripe border
      highlight-current-row @current-change="handleWorkflowstepTableCurrentChange">
      <el-table-column type="index" width="50"></el-table-column>
      <el-table-column type="expand">
        <template #default="props">
          <el-table :data="props.row.StepList" max-height="250" stripe border v-if="props.row.existStep"
            style="margin-left: 48px;width: 40%;">
            <el-table-column type="index" width="50"></el-table-column>
            <el-table-column label="工步" prop="STEPINFODESC" show-overflow-tooltip></el-table-column>
            <el-table-column label="最后变更日期" prop="LASTCHANGEDATE" width="180"></el-table-column>
            <el-table-column label="工步类型" prop="SPECTYPENAME" width="100"></el-table-column>
          </el-table>
        </template>
      </el-table-column>
      <el-table-column label="工序" prop="WORKFLOWSTEPNAME" width="230" show-overflow-tooltip></el-table-column>
      <el-table-column label="工序号" prop="SPECNO" width="100"></el-table-column>
      <el-table-column label="父工序号" prop="PARENTSPECNO" width="100"></el-table-column>
      <el-table-column label="分厂" prop="FACTORYNAME" width="170"></el-table-column>
      <el-table-column label="工序类型" prop="stepType" width="100"></el-table-column>
      <el-table-column label="最后序" prop="DCLASTSTEP" width="100"></el-table-column>
      <el-table-column label="子工艺" prop="ChildWorkflow" width="180"></el-table-column>
      <el-table-column label="最后变更日期" prop="LASTCHANGEDATE" width="180"></el-table-column>
      <el-table-column label="关键序" prop="ISKEY" width="100"></el-table-column>
    </el-table>
    <el-row style="justify-content:right;margin: 10px 20px -35px 0;z-index: 22;width: 1px;float: right;">
      <el-button type="primary" @click="handleWorkflowDetailData('')">信息查询</el-button>
    </el-row>
    <el-tabs v-model="otherDataObj.label" style="margin:5px;">
      <el-tab-pane label="检测项" name="checkitem">
        <el-table height="300" :data="otherDataObj.checkitemList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="工序" prop="WORKFLOWSTEPNAME" width="180" show-overflow-tooltip></el-table-column>
          <el-table-column label="工步" prop="STEPINFODESC" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column label="工步类型" prop="SPECTYPENAME" width="100" show-overflow-tooltip></el-table-column>
          <el-table-column label="序号" prop="CHECKNO" width="80"></el-table-column>
          <el-table-column label="关重符号" prop="NAME" width="150" show-overflow-tooltip></el-table-column>
          <el-table-column label="检测内容描述" width="190" prop="CHECKPOINTNOTEDIS" show-overflow-tooltip>
            <template #default="scope">
              <span v-html="scope.row.CHECKPOINTNOTEDIS"></span>
            </template>
          </el-table-column>
          <el-table-column label="图纸规定" prop="DRAWINGREQUIREDIS" width="220">
            <template #default="scope">
              <span v-html="scope.row.DRAWINGREQUIREDIS"></span>
            </template>
          </el-table-column>
          <el-table-column label="类型" prop="ASSEMBLYTYPE"></el-table-column>
          <el-table-column label="关键过程" prop="KEYCHECKNAME"></el-table-column>
          <el-table-column label="工序检" prop="MEOPCHECKNAME"></el-table-column>
          <el-table-column label="检测类型" prop="CHECKTYPENAME"></el-table-column>
          <el-table-column label="质保单" prop="QUALITYCHECKNAME"></el-table-column>
          <el-table-column label="安装单" prop="ISINSTALL"></el-table-column>
          <el-table-column label="拆卸单" prop="ISDISASSEMBLE"></el-table-column>
          <el-table-column label="通知单" prop="ISNOTICE"></el-table-column>
          <el-table-column label="返回单" prop="ISRETURN"></el-table-column>
          <el-table-column label="综合性能表" prop="ISCOMPP" width="100"></el-table-column>
          <el-table-column label="基本值" prop="BASEVALUE"></el-table-column>
          <el-table-column label="下浮动" prop="CEILFLOAT"></el-table-column>
          <el-table-column label="上浮动" prop="FLOORFLOAT"></el-table-column>
          <el-table-column label="检验序号" prop="BUBBLENUMBER"></el-table-column>
          <el-table-column label="是否SPC" prop="ISSPC"></el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="BOM" name="bom">
        <el-table height="300" :data="otherDataObj.bomList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="件号信息" prop="PRODUCTINFO"></el-table-column>
          <el-table-column label="工序" prop="SPECNAME"></el-table-column>
          <el-table-column label="初装数" prop="QTYREQUIRED"></el-table-column>
          <el-table-column label="检装数" prop="QTY2REQUIRED"></el-table-column>
          <el-table-column label="零件类别" prop="BIGSMALLPART"></el-table-column>
          <el-table-column label="中间件不打印" prop="REFERENCEDESIGNATOR">
            <template #default="scope">
              <el-checkbox v-model="scope.row.REFERENCEDESIGNATOR"></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column label="序列号" prop="MATERIALTXNLOGIC">
            <template #default="scope">
              <el-checkbox v-model="scope.row.MATERIALTXNLOGIC"></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column label="备注" prop="NOTES"></el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="超越单" name="surpassbill">
        <el-table height="300" :data="otherDataObj.surpassList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="超越单名称" prop="SURPASSBILLNAME"></el-table-column>
          <el-table-column label="超越单版本" prop="SURPASSBILLREVISION"></el-table-column>
          <el-table-column label="零件图号" prop="PRODUCTNAME"></el-table-column>
          <el-table-column label="零件名称" prop="PRODUCTDES"></el-table-column>
          <el-table-column label="文件编号" prop="FILENO"></el-table-column>
          <el-table-column label="工艺规程编号" prop="PROCESSNO"></el-table-column>
          <el-table-column label="车间名称" prop="FACTORYNAME"></el-table-column>
          <el-table-column label="批次号" prop="CONTAINERNAME"></el-table-column>
          <el-table-column label="有效期" prop="EFFECTIVE"></el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="工装工具" name="tool">
        <el-table height="300" :data="otherDataObj.toolList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="工序" prop="WORKFLOWSTEPNAME"></el-table-column>
          <el-table-column label="工步" prop="STEPINFODESC"></el-table-column>
          <el-table-column label="工装编号" prop="TOOLNAME"></el-table-column>
          <el-table-column label="编码/规格" prop="DRAWINGNO"></el-table-column>
          <el-table-column label="工具名称" prop="DESCRIPTION"></el-table-column>
          <el-table-column label="工具类型" prop="RESOURCETYPENAME"></el-table-column>
          <el-table-column label="使用数" prop="QTY"></el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="辅材" name="aux">
        <el-table height="300" :data="otherDataObj.auxList" stripe border>
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column label="工序" prop="WORKFLOWSTEPNAME"></el-table-column>
          <el-table-column label="工步" prop="STEPINFODESC"></el-table-column>
          <el-table-column label="辅材编码" prop="AUXMATERIALNAME"></el-table-column>
          <el-table-column label="辅材名称" prop="DESCRIPTION"></el-table-column>
          <el-table-column label="规格" prop="SPECIFICATION"></el-table-column>
          <el-table-column label="技术标准" prop="TECHNICALSTANDARD"></el-table-column>
          <el-table-column label="牌号" prop="VENDORMODEL"></el-table-column>
          <el-table-column label="数量" prop="QTY"></el-table-column>
          <el-table-column label="备注" prop="NOTES"></el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>

    <!-- 按钮区域 -->
    <div class="handle-container" id="btn-wrapper">
      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleChangeBomDetailInfo" :disabled="pageDisabled">
            <el-icon class="item-icon">
              <gold-medal />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">BOM属性维护</div>
      </div>

      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleworkFlowViewPrint" :disabled="pageDisabled">
            <el-icon class="item-icon">
              <circle-check />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">工艺预览</div>
      </div>

      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleStepRelevanToSubWFStep" :disabled="pageDisabled">
            <el-icon class="item-icon">
              <Finished />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">工序关联子工艺工序</div>
      </div>

      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleDocumentViewClick" :disabled="pageDisabled">
            <el-icon class="item-icon">
              <Document />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">文档查看</div>
      </div>

      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleSmallStageClick" :disabled="pageDisabled">
            <el-icon class="item-icon">
              <Operation />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">部件小阶段</div>
      </div>

      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleProductmateriallistitemMemoMaintClick" :disabled="pageDisabled">
            <el-icon class="item-icon">
              <Edit />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">限制信息维护</div>
      </div>
      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleNCProgramViewClick">
            <el-icon class="item-icon">
              <icon-view />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">NC附件查看</div>
      </div>
      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleSpecialCourseViewClick">
            <el-icon class="item-icon">
              <icon-view />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">特殊过程查看</div>
      </div>
      <div class="item">
        <div class="item-image-container">
          <el-link :underline="false" @click="handleThreeCardViewClick">
            <el-icon class="item-icon">
              <icon-view />
            </el-icon>
          </el-link>
        </div>
        <div class="item-text">三定卡片查看</div>
      </div>
    </div>
    <!-- 工序关联子工艺工序 对话框 -->
    <el-dialog v-model="stepRelevanToSubWFStepObj.dialogVisible" title="工序关联子工艺工序" width="40%" :draggable="true"
      align-center>
      <el-card style="height:200px">
        <el-tree style="max-width: 600px" :data="stepRelevanToSubWFStepObj.dataList" node-key="id"
          highlight-current="true" :default-expand-all="true" :expand-on-click-node="false"
          @node-click="handleStepRelevanToSubWFStepNodeClick">
        </el-tree>
      </el-card>
      <el-tabs v-model="productmateriallistitemMemoMaintObj.tabname">
        <el-tab-pane label="子工艺其他版本" name="first">
          <el-row>
            <el-select style="width:200px;margin:0px 20px 15px;" v-model="stepRelevanToSubWFStepObj.workflowid"
              @change="handleSonWFOtherWorkflow">
              <el-option v-for="item in stepRelevanToSubWFStepObj.workflowList" :key="item.WORKFLOWID"
                :label="item.WORKFLOWNAME" :value="item.WORKFLOWID" />
            </el-select>
            <el-button type="primary" :icon="'Check'" @click="handleSelectWorkflowstepSubmitClick">提交选项</el-button>
          </el-row>
          <el-table height="200" :data="stepRelevanToSubWFStepObj.workflowstepList" stripe border :size="'small'"
            ref="workflowstepRef">
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column label="工序号" prop="SPECNO" show-overflow-tooltip></el-table-column>
            <el-table-column label="工序名称" prop="WORKFLOWSTEPNAME"></el-table-column>
            <el-table-column label="主工艺工序" prop="StepInfo"></el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" :icon="'Check'" @click="handleStepRelevanToSubWFStepClick">保存</el-button>
          <el-button @click="stepRelevanToSubWFStepObj.dialogVisible = false" :icon="'Close'">关闭</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 文档查看对话框 -->
    <el-dialog v-model="documentViewObj.dialogVisible" title="文档查看" width="60%" :draggable="true" align-center>
      <el-row :gutter="10">
        <el-col :span="14">
          <el-scrollbar height="400">
            <el-card>
              <template #header>
                <div style="display: flex;align-items: center;position: relative;">
                  <el-icon class="card-header-icon" style="font-size: 20px;">
                    <info-filled />
                  </el-icon>
                  <span class="card-header-text">工艺信息</span>
                </div>
              </template>
              <el-tree :data="documentViewObj.treeData" node-key="id" :default-expand-all="true"
                :expand-on-click-node="false" @node-click="handleNodeClick">
                <template #default="scope">
                  <el-icon v-if="scope.data.type !== 'spec'" style="color:orange;margin-right: 10px;">
                    <Folder />
                  </el-icon>
                  <el-icon v-else style="margin-right: 10px;">
                    <Grid />
                  </el-icon>
                  {{scope.data.label}}
                </template>
              </el-tree>
            </el-card>
          </el-scrollbar>
        </el-col>
        <el-col :span="10">
          <el-card>
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <List />
                </el-icon>
                <span class="card-header-text">文档清单</span>
              </div>
            </template>
            <el-table :data="documentViewObj.documentList" stripe border>
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column label="文档名称" prop="documentname" show-overflow-tooltip>
              </el-table-column>
              <el-table-column label="操作" prop="filepath" width="120">
                <template #default="scope">
                  <el-link type="primary" @click="handleOpenDocumentClick(scope.row.filepath)">查看文档
                  </el-link>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-col>
      </el-row>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="documentViewObj.dialogVisible = false" :icon="'Close'">关闭</el-button>
        </span>
      </template>
    </el-dialog>
    <!-- 部件小阶段 对话框 -->
    <el-dialog v-model="smallStageObj.dialogVisible" title="选择部件小阶段" width="40%" :draggable="true" align-center>
      <el-form :inline="true" :label-position="'top'">
        <el-form-item label="产品名称">
          <el-input v-model="smallStageObj.data.productname" disabled></el-input>
        </el-form-item>
        <el-form-item label="产品版本">
          <el-input v-model="smallStageObj.data.productrev" disabled></el-input>
        </el-form-item>
        <el-form-item label="部件小阶段">
          <el-select style="width:200px" v-model="smallStageObj.data.attributevalue">
            <el-option v-for="item in smallStageObj.dataList" :key="item.value" :label="item.label"
              :value="item.value" />
          </el-select>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" :icon="'Check'" @click="handleSmallStageSubmitClick">确认</el-button>
          <el-button @click="smallStageObj.dialogVisible = false" :icon="'Close'">关闭</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 限制信息维护 对话框 -->
    <el-dialog v-model="productmateriallistitemMemoMaintObj.dialogVisible" title="" width="60%" :draggable="true"
      align-center>
      <el-tabs v-model="productmateriallistitemMemoMaintObj.tabname">
        <el-tab-pane label="限制使用单维护" name="first">
          <el-table height="200" :data="productmateriallistitemMemoMaintObj.dataList" stripe border :size="'small'"
            ref="productmateriallistitemMemoMaintRef" @row-click="productmateriallistitemMemoMaintRowClick"
            highlight-current-row>
            <el-table-column label="工序" prop="SPECNAME" show-overflow-tooltip></el-table-column>
            <el-table-column label="件号信息" prop="PRODUCTINFO"></el-table-column>
            <el-table-column label="设计依据文件号" prop="YJWJH"></el-table-column>
            <el-table-column label="主要内容" prop="ZYNR"> </el-table-column>
            <el-table-column label="限制使用信息" prop="XZSY"></el-table-column>
            <el-table-column label="是否打印" prop="PRINT_STATUS" width="80" :align="'center'">
              <template #default="scope">
                <el-checkbox v-model="scope.row.PRINT_STATUS" :true-value="1" :false-value="0"></el-checkbox>
              </template>
            </el-table-column>
          </el-table>
          <el-form :inline="false" :label-position="'top'">
            <el-form-item label="设计依据文件号">
              <el-input width="100%" v-model="productmateriallistitemMemoMaintObj.row.YJWJH"></el-input>
            </el-form-item>
            <el-form-item label="主要内容">
              <el-input type="textarea" rows="3" v-model="productmateriallistitemMemoMaintObj.row.ZYNR"></el-input>
            </el-form-item>
            <el-form-item label="限制使用信息">
              <el-input type="textarea" rows="3" v-model="productmateriallistitemMemoMaintObj.row.XZSY"></el-input>
            </el-form-item>
          </el-form>
        </el-tab-pane>
      </el-tabs>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" :icon="'Check'" @click="SaveProductmateriallistitemMemoMaintClick">保存</el-button>
          <el-button @click="productmateriallistitemMemoMaintObj.dialogVisible = false" :icon="'Close'">关闭</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- NC附件查看对话框 -->
    <el-dialog v-model="ncProgramViewDialogVisible" title="NC附件查看对话框" width="95%" :draggable="true" align-center>
      <el-card style="padding:10px;margin-top:10px;">
        <template #header>
          <div style="display: flex;align-items: center;position: relative;">
            <el-icon class="card-header-icon" style="font-size: 20px;">
              <info-filled />
            </el-icon>
            <span class="card-header-text">件号NC程序列表</span>
          </div>
        </template>
        <el-table @row-click="getNCProgramDetail" :row-class-name="tableRowClassName" :data="ncProgramDataList" border
          ref="ncProgramDataListRef" height="300">
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column prop="id" label="id" v-if="false"></el-table-column>
          <el-table-column prop="productname" label="零件图号"></el-table-column>
          <el-table-column prop="productdesc" label="零件名称"></el-table-column>
          <el-table-column prop="process_no" label="工艺规程编号"></el-table-column>
          <el-table-column prop="process_rev" label="工艺规程版本"></el-table-column>
          <el-table-column prop="specno" label="工序号"></el-table-column>
          <el-table-column prop="nc_name" label="NC程序名称"></el-table-column>
          <el-table-column prop="nc_no" label="NC程序版本"></el-table-column>
          <el-table-column prop="control_type" label="NC程序系统"></el-table-column>
        </el-table>
      </el-card>

      <el-row :gutter="10">
        <el-col :span="12">
          <el-card style="padding:10px;margin-top:10px;">
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <info-filled />
                </el-icon>
                <span class="card-header-text">设备清单</span>
              </div>
            </template>
            <el-table :data="ncProgarmResourcesList" stripe border height="200">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column prop="id" label="id" v-if="false"></el-table-column>
              <el-table-column prop="equip_code" label="设备编号"></el-table-column>
              <el-table-column prop="equip_xh" label="设备型号"></el-table-column>
            </el-table>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card style="padding:10px;margin-top:10px;">
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <info-filled />
                </el-icon>
                <span class="card-header-text">附件清单</span>
              </div>
            </template>
            <el-table :data="ncProgarmFilesList" stripe border height="200">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column prop="id" label="id" v-if="false"></el-table-column>
              <el-table-column label="附件名称" prop="filename">
                <template #default="scope">
                  <el-link type="primary" @click="handleOpenDocumentClick(scope.row.filepath)">{{scope.row.filename}}
                  </el-link>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-col>
      </el-row>
    </el-dialog>
    <!-- 特殊过程查看对话框 -->
    <el-dialog v-model="specialCourse.specialCourseViewDialogVisible" title="特殊过程查看对话框" width="75%" :draggable="true"
      align-center>
      <el-card style="padding:10px;margin-top:10px;">
        <template #header>
          <div style="display: flex;align-items: center;position: relative;">
            <el-icon class="card-header-icon" style="font-size: 20px;">
              <info-filled />
            </el-icon>
            <span class="card-header-text">件号特殊过程列表</span>
          </div>
        </template>
        <el-table @row-click="getSpecialCourseDetail" :row-class-name="tableRowClassName"
          :data="specialCourse.specialCourseDataList" border ref="specialCourseDataListRef" height="300">
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column prop="WORKFLOWINFO" label="工艺及版本"></el-table-column>
          <el-table-column prop="WORKFLOWSTEPNAME" label="工序名称"></el-table-column>
          <el-table-column prop="SPECIALCOURSESPECREPORTNO" label="确认编号"></el-table-column>
          <el-table-column prop="CREATEDATE" label="创建时间"></el-table-column>
        </el-table>
      </el-card>

      <el-row>
        <el-card style="padding:10px;margin-top:10px;width:100%">
          <template #header>
            <div style="display: flex;align-items: center;position: relative;">
              <el-icon class="card-header-icon" style="font-size: 20px;">
                <info-filled />
              </el-icon>
              <span class="card-header-text">件号特殊过程明细</span>
            </div>
          </template>
          <el-table :data="specialCourse.specialCourseDetailList" border height="200">
            <el-table-column type="index" width="50"></el-table-column>
            <el-table-column prop="SPECIALCOURSESPECREPORTNO" label="确认编号"></el-table-column>
            <el-table-column prop="INDATE" label="有效期"></el-table-column>
            <el-table-column prop="EMPLOYEENAMES" label="员工号" show-overflow-tooltip></el-table-column>
            <el-table-column prop="RESOURCENAMES" label="设备编号" show-overflow-tooltip></el-table-column>
          </el-table>
        </el-card>
      </el-row>
    </el-dialog>
    <!-- 三定卡片查看对话框 -->
    <el-dialog v-model="threeCard.threeCardViewDialogVisible" title="三定卡片查看对话框" width="95%" :draggable="true"
      align-center>
      <el-card style="padding:10px;margin-top:10px;">
        <template #header>
          <div style="display: flex;align-items: center;position: relative;">
            <el-icon class="card-header-icon" style="font-size: 20px;">
              <info-filled />
            </el-icon>
            <span class="card-header-text">三定卡片列表</span>
          </div>
        </template>
        <el-table @row-click="getThreeCardDetail" :row-class-name="tableRowClassName"
          :data="threeCard.threeCardDataList" border height="300">
          <el-table-column type="index" width="50"></el-table-column>
          <el-table-column prop="id" label="id" v-if="false"></el-table-column>
          <el-table-column prop="productname" label="零件图号"></el-table-column>
          <el-table-column prop="productdesc" label="零件名称"></el-table-column>
          <el-table-column prop="workflowname" label="工艺规程编号"></el-table-column>
          <el-table-column prop="workflowversion" label="工艺规程版本"></el-table-column>
          <el-table-column prop="specno" label="工序号"></el-table-column>
          <el-table-column prop="cardcode" label="卡片编码"></el-table-column>
          <el-table-column prop="cardname" label="卡片名称"></el-table-column>
          <el-table-column prop="publishplant" label="发放单位"></el-table-column>
          <el-table-column prop="workcenter" label="工作中心"></el-table-column>
          <el-table-column prop="secret" label="密级"></el-table-column>
          <el-table-column prop="bmqx" label="保密期限"></el-table-column>
          <el-table-column prop="dmyj" label="定密依据" show-overflow-tooltip></el-table-column>
          <el-table-column prop="zxfw" label="知悉范围" show-overflow-tooltip></el-table-column>
        </el-table>
      </el-card>

      <el-row :gutter="10">
        <el-col :span="12">
          <el-card style="padding:10px;margin-top:10px;">
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <info-filled />
                </el-icon>
                <span class="card-header-text">设备清单</span>
              </div>
            </template>
            <el-table :data="threeCard.threeCardResourceList" stripe border height="200">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column prop="id" label="id" v-if="false"></el-table-column>
              <el-table-column prop="code" label="设备编号"></el-table-column>
              <el-table-column prop="name" label="设备型号"></el-table-column>
            </el-table>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card style="padding:10px;margin-top:10px;">
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <info-filled />
                </el-icon>
                <span class="card-header-text">附件清单</span>
              </div>
            </template>
            <el-table :data="threeCard.threeCardFileList" stripe border height="200">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column prop="id" label="id" v-if="false"></el-table-column>
              <el-table-column label="附件名称" prop="name">
                <template #default="scope">
                  <el-link type="primary" @click="handleOpenDocumentClick(scope.row.code)">{{scope.row.name}}
                  </el-link>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card style="padding:10px;margin-top:10px;">
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <info-filled />
                </el-icon>
                <span class="card-header-text">操作工清单</span>
              </div>
            </template>
            <el-table :data="threeCard.threeCardWorkerList" stripe border height="200">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column prop="id" label="id" v-if="false"></el-table-column>
              <el-table-column prop="code" label="员工工号"></el-table-column>
              <el-table-column prop="name" label="员工姓名"></el-table-column>
              <el-table-column prop="worktype" label="工作工位"></el-table-column>
            </el-table>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card style="padding:10px;margin-top:10px;">
            <template #header>
              <div style="display: flex;align-items: center;position: relative;">
                <el-icon class="card-header-icon" style="font-size: 20px;">
                  <info-filled />
                </el-icon>
                <span class="card-header-text">检验员清单</span>
              </div>
            </template>
            <el-table :data="threeCard.threeCardCheckerList" stripe border height="200">
              <el-table-column type="index" width="50"></el-table-column>
              <el-table-column prop="id" label="id" v-if="false"></el-table-column>
              <el-table-column prop="code" label="员工工号"></el-table-column>
              <el-table-column prop="name" label="员工姓名"></el-table-column>
              <el-table-column prop="worktype" label="工作工位"></el-table-column>
            </el-table>
          </el-card>
        </el-col>
      </el-row>
    </el-dialog>
  </div>

  <script type="module">
    const { createApp, reactive, ref, toRef, toRefs, onMounted, watch, nextTick } = Vue
    const { ElMessage, ElLoading, ElMessageBox, ElNotification } = ElementPlus
    import { useProductWorkflow } from '../../../Scripts/hooks/productworkflow/useProductWorkflow.js';
    import { useDocumentView } from '../../../Scripts/hooks/containercheck/useDocumentView.js';
    import { useNCProgramView } from '../../../Scripts/hooks/workreport/useNCProgramView.js';
    import { getParams } from '../../../Scripts/utils/common.js';//获取页面参数
    import { useSpecialCourse } from '../../../Scripts/hooks/productworkflow/useSpecialCourse.js';
    import { useThreeCard } from '../../../Scripts/hooks/productworkflow/useThreeCard.js';
    const App = {
      setup() {
        const FetchCommonUrl = '../../../Ashx/FetchCommonHandler.ashx';
        const baseAPIUrl = '../../../Ashx/ProductWorkflowDataViewVue3PageHandler.ashx';
        const baseAPI = '../../../Ashx/ContainerStepWorkReportVue3PageHandler.ashx';
        const {
          queryInfo,
          getProductList,
          getWorkflowList,
          productSelectHandle,
          productHandleClear,
          workflowHandleClear,
          getProductAndWorkflowData,
          mainDataInfoObj,
          otherDataObj,
          handleWorkflowDetailData,
          handleChangeBomDetailInfo,
          workflowstepRef,
          stepRelevanToSubWFStepObj,
          handleStepRelevanToSubWFStep,
          handleSonWFOtherWorkflow,
          handleStepRelevanToSubWFStepNodeClick,
          handleSelectWorkflowstepSubmitClick,
          handleWorkflowstepTableCurrentChange,
          handleStepRelevanToSubWFStepClick,
          handleworkFlowViewPrint,
          productmateriallistitemMemoMaintObj,
          handleProductmateriallistitemMemoMaintClick,
          smallStageObj,
          handleSmallStageSubmitClick,
          handleSmallStageClick,
          productmateriallistitemMemoMaintRowClick,
          SaveProductmateriallistitemMemoMaintClick,
          handleOpenUse } = useProductWorkflow()

        // 文档查看
        const { documentViewObj, getDocumentViewTreeData, getDocumentList, downloadFile } = useDocumentView();
        const pageDisabled = ref(false)
        // NC附件查看
        const {
          ncProgramViewDialogVisible,
          ncProgramDataList,//数控程序清单
          getNCProgramData,
          getNCProgramDetail,
          tableRowClassName,
          ncProgarmResourcesList,//设备清单
          ncProgarmFilesList,//附件清单
        } = useNCProgramView();
        //重置按钮
        async function handleCanSearch() {
          await productHandleClear();
          queryInfo.productid = ''
          queryInfo.workflowid = ''
          queryInfo.productname = ''
          queryInfo.workflowname = ''
          mainDataInfoObj.productInfo = {}
          mainDataInfoObj.workflowInfo = {}
          mainDataInfoObj.workflowstepTable = []
          otherDataObj.checkitemList = []
          otherDataObj.bomList = []
          otherDataObj.surpassList = []
          otherDataObj.toolList = []
          otherDataObj.auxList = []
        }
        //  工序table表格展开行箭头隐藏
        async function cellStyle(row, rowIndex) {
          if (!row.row.existStep) {
            var cellid = document.getElementsByClassName('el-table_1_column_2');
            if (cellid[row.rowIndex + 1] === undefined) return;
            var cellClass = cellid[row.rowIndex + 1].getElementsByClassName('cell')[0];
            cellClass.setAttribute("style", "display:none")
          }
          return ''
        }
        //【文档查看】按钮点击
        async function handleDocumentViewClick() {
          if (queryInfo.productid === '' || queryInfo.productid === undefined) {
            ElMessage({ type: 'error', message: `请选择零件信息再进行操作`, grouping: true });
            return;
          }
          if (queryInfo.workflowid === '' || queryInfo.workflowid === null) {
            ElMessage({ type: 'error', message: `请选择工艺路线再进行操作`, grouping: true });
            return;
          }
          const productid = queryInfo.productList.filter(item => item.PRODUCTNAME === queryInfo.productid)[0].PRODUCTID;
          let currentSelectContainer = { productid: productid, workflowid: queryInfo.workflowid };
          await getDocumentViewTreeData({ currentSelectContainer: currentSelectContainer });
        };
        // 【文档查看】- 节点点击事件
        async function handleNodeClick(node) {
          await getDocumentList(node);
        };
        // 【文档查看】-【查看文档】按钮点击
        async function handleOpenDocumentClick(filepath) {
          await downloadFile(filepath);
        };
        // NC程序附件查看
        async function handleNCProgramViewClick() {
          const productid = queryInfo.productList.filter(item => item.PRODUCTNAME === queryInfo.productid)[0].PRODUCTID;
          let currentSelectContainer = { productid: productid, productname: queryInfo.productid.split(':')[0], workflowid: queryInfo.workflowid };
          getNCProgramData({ currentSelectContainer: currentSelectContainer, baseAPI });
        }
        //特殊过程查看
        const {
          specialCourse,
          getSpecialCourseDataList,
          getSpecialCourseDetailList
        } = useSpecialCourse();
        async function handleSpecialCourseViewClick() {
          const workflowids = queryInfo.workflowid; //queryInfo.workflowList.map(item => item.WORKFLOWID)
          getSpecialCourseDataList(workflowids); //workflowids.join(',')
        }
        async function getSpecialCourseDetail(row) {
          getSpecialCourseDetailList(row.SPECIALCOURSESPECREPORTNO);
        }
        //三定卡片查看
        const {
          threeCard,
          getThreeCardDataList,
          getThreeCardDetailList
        } = useThreeCard();
        async function handleThreeCardViewClick() {
          const workflowids = queryInfo.workflowList.map(item => item.WORKFLOWID)
          getThreeCardDataList(workflowids.join(','), queryInfo.productid.split(':')[0]);
        }
        async function getThreeCardDetail(row) {
          getThreeCardDetailList(row.id)
        }


        // 页面声明周期钩子
        onMounted(async () => {
          const uid = Decrypt(getParams('uid'));
          if (uid != '') {
            queryInfo.userInfo = JSON.parse(uid)
          }
        })

        // 返回给页面使用的数据
        return {
          queryInfo,
          mainDataInfoObj,
          otherDataObj,//检测项、bom、工装及辅材信息
          getProductList,
          getWorkflowList,
          productSelectHandle,
          productHandleClear,
          workflowHandleClear,
          handleCanSearch,
          getProductAndWorkflowData,
          handleOpenUse,
          cellStyle,
          handleWorkflowDetailData,
          handleChangeBomDetailInfo,
          workflowstepRef,//子工艺工序Ref
          stepRelevanToSubWFStepObj,
          handleStepRelevanToSubWFStep,
          handleSonWFOtherWorkflow,
          handleStepRelevanToSubWFStepNodeClick,//【工艺树形节点】点击
          handleSelectWorkflowstepSubmitClick,//【提交选项】按钮点击
          handleWorkflowstepTableCurrentChange,
          handleStepRelevanToSubWFStepClick,//【保存】按钮点击
          handleworkFlowViewPrint,
          documentViewObj,//【文档查看对象】
          handleDocumentViewClick,//【文档查看】按钮点击
          handleNodeClick,//【文档查看】- 节点点击事件
          handleOpenDocumentClick,//【文档查看】-【查看文档】按钮点击
          productmateriallistitemMemoMaintObj,
          handleProductmateriallistitemMemoMaintClick,
          smallStageObj,
          handleSmallStageSubmitClick,
          handleSmallStageClick,
          productmateriallistitemMemoMaintRowClick,
          SaveProductmateriallistitemMemoMaintClick,
          handleNCProgramViewClick,//NC程序附件查看
          ncProgramViewDialogVisible,
          ncProgramDataList,//数控程序清单
          ncProgarmResourcesList,//设备清单
          ncProgarmFilesList,//附件清单
          getNCProgramDetail,
          pageDisabled,
          specialCourse,
          getSpecialCourseDataList,
          getSpecialCourseDetailList,
          handleSpecialCourseViewClick,
          getSpecialCourseDetail,
          threeCard,
          getThreeCardDataList,
          getThreeCardDetailList,
          handleThreeCardViewClick,
          getThreeCardDetail
        }
      }
    };
    const app = createApp(App);

    app.use(ElementPlus, {
      locale: ElementPlusLocaleZhCn
    });

    // 注册所有icon
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
      switch (key) {
        case "View":
          app.component('icon-view', component)
          break;
        case "Menu":
          app.component('icon-menu', component)
          break;
        default:
          app.component(key, component)
          break;
      }
    }

    app.mount('#app');
  </script>
</body>

</html>